import { FC, lazy } from 'react'
import { Navigate, useRoutes, RouteObject } from 'react-router-dom'

import LayoutPage from '@/layout'
import WrapperRouteComponent from './config'
import Dashboard from '@/pages/dashboard'
import LoginPage from '@/pages/login'

const Guide = lazy(() => import('@/pages/guide'))

const routeList: RouteObject[] = [
  {
    path: '/login',
    element: <WrapperRouteComponent element={<LoginPage />} titleId='登录' auth={false} />
  },
  {
    path: '/',
    element: <WrapperRouteComponent element={<LayoutPage />} />,
    children: [
      {
        path: '',
        element: <Navigate to='dashboard' />
      },
      {
        path: 'dashboard',
        element: <WrapperRouteComponent element={<Dashboard />} titleId='首页' />
      },
      {
        path: 'guide',
        element: <WrapperRouteComponent element={<Guide />} titleId='向导' />
      }
    ]
  }
]

const routes: FC = () => {
  const element = useRoutes(routeList)

  return element
}

export default routes
